<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>详情页面</title>
    <link rel="stylesheet" href="css/headerfooter.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/index.css" />
    <link rel="stylesheet" href="css/detail.css">
    <script src="./script/main.js" type="module" id="detail"></script>
</head>

<body>
    <!-- 头部 -->
    <div class="navv">
    </div>
    <div class="head">
    </div>
    <!-- 详情 -->
    <div class="hz2"></div>
    <!-- 详情页面的核心布局 -->
    <div class="goodsinfo">
        <div class="wrap">
            <!-- 小图 -->
            <div id="spic">
                <img src="" alt="" />
                <!--小放-->
                <div id="sf"></div>
            </div>
            <!-- 大放 -->
            <div id="bf">
                <!-- 大图 -->
                <img src="" alt="" id="bpic" />
            </div>
            <div id="ulist">
                <a href="javascript:;" id="left">&lt;</a>
                <div id="list">
                    <ul>
                        <!-- 这里是小图的位置，渲染 -->
                    </ul>
                </div>
                <a href="javascript:;" id="right">&gt;</a>
            </div>
        </div>
        <div class="goodsinfo-word">
            <div class="p-name">
                <a class="loadtitle" href="#"></a>
            </div>
            <div class="goods-right-line"></div>
            <pre class="goods-link design-link" style="color: rgb(249, 62, 82); margin-left: 50px;font-weight:700;">此商品支持使用优惠券</pre>
            <pre class="goods-link design-link" style="color: rgb(249, 62, 82); margin-left: 50px;font-weight:600;"><br>特价商品</pre>
            <div class="p-price" style="font-weight: 700; font-size: 26px;background-color: rgb(234, 234, 234);">
                <span style="
                color: #fff;
                font-weight: 700;
                font-size: 14px;
                line-height: 27px;
                background-color: #f93e52;">直降价</span>
                <strong><em style="color: #f93e52;">￥</em><i class="loadpcp" style="color: #f93e52;"></i></strong>
            </div>
            <!-- 缩略图 -->
            <div class="smimg">
                <div id="sp">
                    <div>已选款式</div>
                    <img src="" alt="" />
                </div>
                <img src="//lining-store-online-1302115263.file.myqcloud.com/icon/goods/selected.png" class="sp-img" alt="" style="width: 20px; height: 20px;">
            </div>
            <div class="coupon-title">优惠：可参与以下优惠活动
                <div class="hd">
                    <img src="//lining-store-online-1302115263.file.myqcloud.com/icon/goods/coupon-logo.png" style="width: 51px; height: 20px;">
                    <span>满3000减500</span>
                    <span>满5000减800</span>
                    <span style="padding: 0 2px;color: #f93e52;font-weight: 400;font-size: 10px;line-height: 27px;border: 1px solid #f93e52;border-radius: 2px;margin-left: 4px;cursor: pointer;">领取</span>
                </div>
            </div>
            <div class="coupon-title">
                <div class="hd">
                    <img src="//lining-store-online-1302115263.file.myqcloud.com/icon/goods/coupon-logo.png" style="width: 51px; height: 20px;">
                    <span>满8000减1000</span>
                    <span>满9000减2000</span>
                    <span style="padding: 0 2px;color: #f93e52;font-weight: 400;font-size: 10px;line-height: 27px;border: 1px solid #f93e52;border-radius: 2px;margin-left: 4px;cursor: pointer;">领取</span>
                </div>
            </div>
            <div class="btn2">
                <!-- <span>立即购买</span> -->
                <a href="javascript:;">立即购买</a>
            </div>
            <div class="p-btn">
                <input type="text" id="count" value="1" />
                <a href="javascript:;">加入购物车</a>
            </div>
            <div class="gw">
                <a href="cartlist.html" target="_blank">进入购物车</a>
            </div>
        </div>
    </div>


    <!-- 底部 -->
    <div class="foot"></div>
</body>

</html>